import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-lesson5-three',
  templateUrl: './lesson5-three.component.html',
  styleUrls: ['./lesson5-three.component.scss']
})
export class Lesson5ThreeComponent implements OnInit {

  html = `
  <form (submit)="submit()" ngNativeValidate>
    <div class="form-group">
      <label>用户名</label>
      <input type="text" name="user" required class="form-control">
    </div>
    <div class="form-group">
      <label for="exampleInputEmail1">密码</label>
      <input type="password" name="password" required class="form-control">
    </div>
    <div class="form-group">
      <label>email</label>
      <input type="email" name="email" required class="form-control">
    </div>
    <div class="form-group">
      <label>url</label>
      <input type="url" name="url" required class="form-control">
    </div>
    <button type="submit" class="btn btn-primary">登录</button>
  </form>`;

  ts = `
  submit() {
    event.preventDefault(); // 阻止默认事件
    alert('表单验证通过...');
  }`;
  constructor() { }

  ngOnInit() {
  }

  submit() {
    event.preventDefault(); // 阻止默认事件
    alert('表单验证通过...');
  }
}
